<link rel="stylesheet" data-th-href="@{css/tpv/meeting.css}">

<div data-th-include="vc/meeting/meetingAdd"></div>
<div data-th-include="vc/meeting/meetingDetail"></div>
<div data-th-include="vc/meeting/meetingCopy"></div>
<div data-th-include="vc/meeting/meetingDelete"></div>
<div data-th-include="vc/meeting/meetingLock"></div>
<div data-th-include="vc/meeting/meetingWechatInvite"></div>

<div class="modal fade tpv-modal" id="event-detail" data-keyboard="false" data-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-lg tpv-modal-dialog-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title pull-left">[[#{meeting.detail}]]<span id="meeting-detail-name"></span></h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
            </div>
            <div class="modal-footer">
                <!-- <button type="button" class="btn btn-close tpv-btn-primary" name="save">[[#{confirm}]]</button> -->
                <button class="btn-hide"></button>
            </div>
        </div>
    </div>
</div>
<!--<div class="card" style="padding-bottom:0px">
    <div class="card-block" style="padding-bottom:0px">
        <div class="col-sm-12" style="height:56px">
            <ul class="nav nav-tabs" id="my-tab">
                <li class="nav-item">
                    <a class="nav-link" href="#my-schedule" data-toggle="tab">会议排程</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#my-list" data-toggle="tab">会议列表</a>
                </li>
            </ul>
        </div>
        <div class="tab-content" >
            <div class="tab-pane active" id="my-schedule">
                <div data-th-include="vc/meeting/mySchedule"></div>
            </div>
            <div class="tab-pane" id="my-list">
                <div data-th-include="vc/meeting/myList"></div>
            </div>
        </div>
    </div>
</div>-->

<div class="card">
    <div class="tpv-main-header clearfix">
        <div class="tpv-tabs j-tpv-tab">
            <ul class="tpv-tab-items">
                <li class="tpv-item active" data-tab="my-schedule">
                    <i class="tpvfont tpv-side_icon_schedule"></i>&nbsp;&nbsp;[[#{meeting.my.schedule}]]
                </li>
                <li class="tpv-item" data-tab="my-list">
                    <i class="tpvfont tpv-side_icon_list"></i>&nbsp;&nbsp;[[#{meeting.my.list}]]
                </li>
            </ul>
        </div>
        <div data-tab="my-schedule" class="tpv-meet-header">
            <div class="tpv-table-group-toggle j-group-toggle">
                <div class="btn-group btn-group-toggle" data-toggle="buttons">
                    <label class="btn btn-save" style="min-width:75px;">
                        <input type="radio" name="state" value="0" data-th-text="#{meeting.my.book}">
                    </label>
                    <label class="btn btn-save" style="min-width:75px;">
                        <input type="radio" name="state" value="0" data-th-text="#{meeting.list.tojoin}">
                    </label>
                    <label class="btn btn-save" style="min-width:75px;">
                        <input type="radio" name="state" value="1" data-th-text="#{meeting.list.joined}">
                    </label>
                </div>
                <div class="tpv-filter-item tpv-filter-auto">
                    <button type="button" class="btn tpv-btn-warning" onclick="refreshSchedule()" th:title="#{common.btn.reset}" style="width:75px">[[#{common.btn.reset}]]</button>
                </div>
            </div>
        </div>
        <div data-tab="my-list" id="data-table_filter" class="dataTables_filter tpv-main-filter tpv-hide">
            <form class="meeting-table-form">
                <div class="tpv-filter-layout">
                    <div class="tpv-filter-item">
                        <div class="input-group">
                            <span class="input-group-addon" data-th-text="#{meeting.list.date} +'： '" style="font-size:14px;color:#000;"></span>
                            <div class="form-group">
                                <input type="hidden" name="meeting-filter-start-date-link" id="meeting-filter-start-date-link"/>
                                <input class="form-control tpv-date-picker" type="text" id="meeting-filter-start-date" data-link-field="meeting-filter-start-date-link" data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd" autocomplete="off" readonly/>
                            </div>
                            <span class="input-group-addon tpv-label-space" style="font-size:14px;color:#000;"> - </span>
                            <div class="form-group">
                                <input type="hidden" name="meeting-filter-end-date-link" id="meeting-filter-end-date-link"/>
                                <input class="form-control tpv-date-picker" type="text" id="meeting-filter-end-date" data-link-field="meeting-filter-end-date-link" data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd" autocomplete="off" readonly/>
                            </div>
                        </div>
                    </div>

                    <div class="tpv-filter-item tpv-sm-filter-item">
                        <div class="input-group">
                            <span class="input-group-addon" data-th-text="#{meeting.list.room} +'： '" style="font-size:14px;color:#000;"></span>
                            <div class="form-group">
                                <select class="form-control" name="meeting-filter-room-id">
                                    <option  value="" data-th-text="#{meeting.select.hint.room}"></option>
                                    <option  th:each="meetingRoom:${meetingRooms}" th:value="${meetingRoom.roomId}" th:text="${meetingRoom.meetingRoomName}"></option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="tpv-filter-item tpv-sm-filter-item">
                        <div class="input-group">
                            <span class="input-group-addon" data-th-text="#{meeting.list.topic} +'： '" style="font-size:14px;color:#000;"></span>
                            <div class="form-group">
                                <input type="text" name="meeting-filter-topic" class="form-control" maxlength="80" onchange="search()"> <i class="form-group__bar"></i>
                            </div>
                        </div>
                    </div>

                    <div class="tpv-filter-item tpv-sm-filter-item" >
                        <div class="input-group">
                            <span class="input-group-addon" data-th-text="#{meeting.list.id} +'： '" style="font-size:14px;color:#000;"></span>
                            <div class="form-group">
                                <input type="text" name="meeting-filter-meetingId" class="form-control" maxlength="80" onchange="search()"> <i class="form-group__bar"></i>
                            </div>
                        </div>
                    </div>
                    <div class="tpv-filter-item tpv-filter-auto">
                        <button type="button" class="btn tpv-btn-warning" onclick="refresh()" th:title="#{common.btn.reset}" style="width:75px">[[#{common.btn.reset}]]</button>
                    </div>
                    <!-- end -->
                </div>
            </form>
        </div>
    </div>
    <div class="card-block" id="my-schedule">
        <div data-th-include="vc/meeting/mySchedule"></div>
    </div>
    <div class="card-block tpv-hide" id="my-list">
        <div data-th-include="vc/meeting/myList"></div>
    </div>
</div>

<script data-th-src="@{js/app/vc/meeting/mine.js(t=${version})}"></script>